<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>图片轮播</title>
    <link rel="stylesheet" href="/static/layui/css/layui.css">
</head>
<body >

<!--<fieldset class="layui-elem-field layui-field-title" style="margin-top: 50px;">-->
<!--<legend>填充轮播元素 - 以图片为例</legend>-->
<!--</fieldset>-->
<div>
    <a href="/admin/index/index" color="red" style="margin-left:50px;"><h2>返回博客列表</h2></a>
</div>
<div class="layui-carousel" id="test10" style="margin:0 auto">
    <p style="color:#009688;font-size:25px;text-align:center;">图片轮播展示</p>
    <div carousel-item="">
        {volist name="row" id="vo"}
        <img src="{$vo.path_name}" alt="">
        {/volist}
    </div>
    <br>
</div>

</body>
</html>
<script src="/static/layui/layui.js"></script>
<script>
    layui.use('carousel', function(){
        var carousel = layui.carousel;
        //图片轮播
        carousel.render({
            elem: '#test10'
            ,width: '600px'
            ,height: '440px'
            ,interval: 1000
        });
    });
</script>